import {Dimensions, StyleSheet} from "react-native";
import colors from "../../styles/colors";

const {width, height} = Dimensions.get('window');


const styles = StyleSheet.create({
  safeAreaContainer: {
    flex: 1,
    backgroundColor: colors.backgroundGreen
  },
  container: {
    flex: 1
  },
  balanceTopContainer: {
    height: 200
  },
  header: {
    height: 60,
    paddingLeft: 15,
    paddingRight: 15,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between'
  },
  headerLeft: {
    flex: 1,
    textAlign: 'left',
    color: colors.white
  },
  headerCenter: {
    flex: 1,
    fontSize: 18,
    textAlign: 'center',
    color: colors.white,
    fontWeight: 'bold'
  },
  headerRight: {
    flex: 1,
    fontSize: 14,
    textAlign: 'right',
    color: colors.white
  },
  summaryContainer: {
    marginBottom: 45,
    flex: 1,
    paddingLeft: 20,
    paddingRight: 20,
    flexDirection: 'row',
    alignItems: 'flex-end'
  },
  summaryLeft: {
    flex: 1
  },
  summaryRight: {
    flex: 1,
    alignItems: 'flex-end',
    justifyContent: 'flex-end'
  },
  summaryLeftText1: {
    color: colors.white,
    fontSize: 14
  },
  summaryLeftText2: {
    color: colors.white,
    fontSize: 30
  },
  summaryLeftText3: {
    color: colors.white,
    fontSize: 10
  },
  checkboxItem: {
    height: 20,
    justifyContent: 'flex-end',
    width: 100,
  },
  checkboxText: {
    fontSize: 12,
    color: colors.white,
    marginLeft: 5
  },
  balanceBottomContainer: {
    flex: 1,
    backgroundColor: colors.backgroundGray,
    zIndex: 999
  },
  bottomContainerPosition: {
    position: 'absolute',
    left: 0,
    right: 0,
    bottom: 0,
    top: -30
  },
  scrollContainer: {
    flex: 1
  },
  listContainer: {
    flex: 1,
    alignItems: 'center'
  },
  listItem: {
    width: width - 30,
    height: 100,
    backgroundColor: colors.white,
    borderRadius: 2,
    marginBottom: 10,
    flex: 1,
    paddingLeft: 15,
    paddingRight: 15
  },
  listTop: {
    flex: 2,
    justifyContent: 'center'
  },
  listTopText: {
    fontSize: 16,
    color: colors.green
  },
  listBottom: {
    flexDirection: 'row',
    flex: 3,
    justifyContent: 'space-between',
    alignItems: 'flex-start',
    paddingTop: 10
  },
  listBottomItem: {
    justifyContent: 'center'
  },
  listBottomText1: {
    fontSize: 12, color: colors.lightTextGray
  },
  listBottomText2: {
    fontSize: 15,
    color: colors.darkTextGray,
    fontWeight: 'bold',
    marginTop: 5
  },
  listBottomText1Last: {
    textAlign: 'right',
    fontSize: 12,
    color: colors.lightTextGray
  },
  listBottomText2Last: {
    textAlign: 'right',
    fontSize: 15,
    color: colors.darkTextGray,
    fontWeight: 'bold',
    marginTop: 5
  }
});

export default styles;